<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!--Css样式-->

    <!--Logo-->
    <style type="text/css">
        .sidebar-menu .logo-env .logo{
            width: 100px;
            height: 50%;
            z-index: 10;
        }
    </style>
</head>



<body>
<!--提取整体页面的侧边栏以供复用-->
<div class="sidebar-menu" th:fragment="sidebar">

    <header class="logo-env">

        <!-- 图标logo -->
        <div class="logo">
            <p style="font-size: 30px;margin-left: 25%;color: #a0c1f5;font-weight: bolder;font-style: italic;">
                晓辰毕设
            </p>
            <img th:src="@{/image/img/logoChen.png}" width="120" alt="" style="margin-left: 25%">
        </div>

        <!-- logo collapse icon -->

        <div class="sidebar-collapse">
            <a href="#" class="sidebar-collapse-icon with-animation">
                <i class="entypo-menu"></i>
            </a>
        </div>

        <div class="sidebar-mobile-menu visible-xs">
            <a href="#" class="with-animation">
                <i class="entypo-menu"></i>
            </a>
        </div>

    </header>

    <ul id="main-menu" class="">

<!--        <li id="search">-->
<!--            <form method="get" action="">-->
<!--                <input type="text" name="q" class="search-input" placeholder="搜索">-->
<!--                <button type="submit">-->
<!--                    <i class="entypo-search"></i>-->
<!--                </button>-->
<!--            </form>-->
<!--        </li>-->


        <li th:class="${active=='index.html' || active=='watchSystem.html' || active=='waterlineDetection.html'?'active opened active':''}">
            <a th:href="@{/toIndex}">
                <i class="entypo-gauge"></i>
                <span>数据展示</span>
            </a>
            <ul>
                <li th:class="${active=='index.html'?'active':''}">
                    <a th:href="@{/toIndex}">
                        <span>实时数据</span>
                    </a>
                </li>


                <li th:class="${active=='watchSystem.html'?'active':''}">
                    <a th:href="@{/toWatch}">
                        <span>监测系统</span>
                    </a>
                </li>

<!--                <li th:class="${active=='waterlineDetection.html'?'active':''}">-->
<!--                    <a th:href="@{/toWater}">-->
<!--                        <span>水质检测</span>-->
<!--                    </a>-->
<!--                </li>-->
            </ul>
        </li>


        <li th:class="${active=='waterQuality.html'||active=='members.html'||active=='list.html'?'active opened active':''}">
            <a th:href="@{/toSensor}">
                <i class="entypo-bag"></i>
                <span>数据管理</span>
            </a>
            <ul>
                <li th:class="${active=='list.html'?'active':''}">
                    <a th:href="@{/company}">
                        <span>企业信息</span>
                    </a>
                </li>
                <li th:class="${active=='members.html'?'active':''}">
                    <a th:href="@{/sewage/page/1}">
                        <span>企业排污信息</span>
                    </a>
                </li>
                <li th:class="${active=='waterQuality.html'?'active':''}">
                    <a th:href="@{/toWaterQuality}">
                        <span>地表水水质信息</span>
                    </a>
                </li>

<!--                <li th:class="${active=='waterQuality.html'?'active':''}">-->
<!--                    <a th:href="@{/waterpage/page/1}">-->
<!--                        <span>地表水水质信息</span>-->
<!--                    </a>-->
<!--                </li>-->


<!--                <li th:class="${active=='sensor.html'?'active':''}">-->
<!--                    <a th:href="@{/toSensor}">-->
<!--                        <span>传感器</span>-->
<!--                    </a>-->
<!--                </li>-->
            </ul>
        </li>

        <li th:class="${active=='personal.html' || active=='report.html' || active=='notes.html'?'active opened active':''}">
<!--        <li th:class="${active=='personal.html'||active=='notes.html'?'active opened active':''}">-->
            <!--        <li th:class="${active=='data.html' || active=='report.html' || active=='dataSec.html' || active=='dataThd.html'?'active opened active':''}">-->
            <a th:href="@{/toData}">
<!--                <i class="entypo-bag"></i>-->
                <i class="entypo-doc-text"></i>
                <span>分析报告与我的</span>
            </a>
            <ul>
                <li th:class="${active=='report.html'?'active':''}">
                    <a th:href="@{/toReport}">
                        <span>排污报告</span>
                    </a>
                </li>

                <li th:class="${active=='personal.html'?'active':''}">
                    <a th:href="@{/toPersonal}">
                        <span>管理员信息</span>
                    </a>
                </li>
                <li th:class="${active=='notes.html'?'active':''}">
                    <a th:href="@{/toNotes}">
                        <span>管理员日志</span>
                    </a>
                </li>
                <li>
                    <a th:href="@{/toLogin}">
                        <span>切换用户</span>
                    </a>
                </li>
<!--                下面页面：无法嵌入到正常页面中-->
<!--                <li th:class="${active=='data.html'?'active':''}">-->
<!--                    <a th:href="@{/toData}">-->
<!--                        <span>数据分析中心</span>-->
<!--                    </a>-->
<!--                </li>-->

<!--                <li th:class="${active=='dataSec.html'?'active':''}">-->
<!--                    <a th:href="@{/toDataSec}">-->
<!--                        <span>数据分析展示</span>-->
<!--                    </a>-->
<!--                </li>-->

<!--                <li th:class="${active=='dataThd.html'?'active':''}">-->
<!--                    <a th:href="@{/toDataThd}">-->
<!--                        <span>数据中控中心</span>-->
<!--                    </a>-->
<!--                </li>-->
            </ul>
        </li>

<!--        下面三个为：我的相关信息-->
<!--        <li th:class="${active=='personal.html'||active=='notes.html'?'active opened active':''}">-->
<!--            <a th:href="@{/toPersonal}">-->
<!--                <i class="entypo-doc-text"></i>-->
<!--                <span>我的</span>-->
<!--            </a>-->
<!--            <ul>-->
<!--                <li th:class="${active=='personal.html'?'active':''}">-->
<!--                    <a th:href="@{/toPersonal}">-->
<!--                        <span>管理员信息</span>-->
<!--                    </a>-->
<!--                </li>-->
<!--                <li th:class="${active=='notes.html'?'active':''}">-->
<!--                    <a th:href="@{/toNotes}">-->
<!--                        <span>管理员日志</span>-->
<!--                    </a>-->
<!--                </li>-->
<!--                <li>-->
<!--                    <a th:href="@{/toLogin}">-->
<!--                        <span>切换用户</span>-->
<!--                    </a>-->
<!--                </li>-->
<!--            </ul>-->
<!--        </li>-->

    </ul>
</div>
<!--提取整体页面的头部栏以供复用-->
<div class="row" th:fragment="topbar">

    <!-- Profile Info and Notifications -->
    <div class="col-md-6 col-sm-8 clearfix">

        <ul class="user-info pull-left pull-none-xsm">

            <!-- Profile Info -->
            <li class="profile-info dropdown"><!-- add class "pull-right" if you want to place this from right -->

                <a class="dropdown-toggle" data-toggle="dropdown">
                    <img th:src="@{/image/img/梁朝伟.png}" alt="" class="img-circle" width="44">
                    <p id="p_admin" style="font-size: 15px;line-height: 15px">当前管理员用户：[[${session.loginAdmin}]]</p>

                </a>

                <ul class="dropdown-menu">

                    <!-- Reverse Caret -->
                    <li class="caret"></li>

                    <!-- Profile sub-links -->
                    <li>
                        <a href="extra-timeline.html">
                            <i class="entypo-user"></i>
                            Edit Profile
                        </a>
                    </li>

                    <li>
                        <a href="mailbox.html">
                            <i class="entypo-mail"></i>
                            Inbox
                        </a>
                    </li>

                    <li>
                        <a href="extra-calendar.html">
                            <i class="entypo-calendar"></i>
                            Calendar
                        </a>
                    </li>

                    <li>
                        <a href="#">
                            <i class="entypo-clipboard"></i>
                            Tasks
                        </a>
                    </li>
                </ul>
            </li>

        </ul>

        <ul class="user-info pull-left pull-right-xs pull-none-xsm">

            <!-- Raw Notifications -->
            <li class="notifications dropdown">

                <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
                    <i class="entypo-attention"></i>
                    <span class="badge badge-info">4</span>
                </a>

                <ul class="dropdown-menu">
                    <li class="top">
                        <p class="small">
                            <a href="#" class="pull-right">全部标记为已读</a>
                            你有 <strong>3条</strong> 新通知.
                        </p>
                    </li>

                    <li>
                        <ul class="dropdown-menu-list scroller">
                            <li class="unread notification-success">
                                <a href="#">
                                    <i class="entypo-user-add pull-right"></i>

                                    <span class="line">
					                    <strong>新用户注册</strong>
                                    </span>

                                    <span class="line small">
					                30 秒 前
                                    </span>
                                </a>
                            </li>

                            <li class="unread notification-secondary">
                                <a href="#">
                                    <i class="entypo-heart pull-right"></i>

                                    <span class="line">
					                    <strong>关注的人</strong>
				                    </span>

                                    <span class="line small">
					                    2 分钟前
				                    </span>
                                </a>
                            </li>

                            <li class="notification-primary">
                                <a href="#">
                                    <i class="entypo-user pull-right"></i>

                                    <span class="line">
				                    	<strong>隐私设置更改</strong>
				                     </span>

                                    <span class="line small">
					                    3 小时前
				                    </span>
                                </a>
                            </li>

                            <li class="notification-warning">
                                <a href="#">
                                    <i class="entypo-rss pull-right"></i>

                                    <span class="line">
				                    	批准的新通知
				                    </span>

                                    <span class="line small">
					                    上个星期
				                    </span>
                                </a>
                            </li>
                        </ul>
                    </li>

                    <li class="external">
                        <a href="#">查看所有通知</a>
                    </li>				</ul>

            </li>

            <!-- Message Notifications -->
            <li class="notifications dropdown">

                <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
                    <i class="entypo-mail"></i>
                    <span class="badge badge-secondary">3</span>
                </a>

                <ul class="dropdown-menu">
                    <li>
                        <ul class="dropdown-menu-list scroller">
                            <li class="active">
                                <a href="#">
				                 <span class="image pull-right">
				            	    <img src="/picture/thumb-1.png" alt="" class="img-circle">
				                 </span>
                                 <span class="line">
					                <strong>林新</strong>
					                    - 昨天
				                 </span>
                                 <span class="line desc small">
				                    	这不是我们的第一个项目，它是其余项目中最好的。
				                 </span>
                                </a>
                            </li>

                            <li><a href="#">
                                <span class="image pull-right">
                                    <img src="/picture/thumb-3.png" alt="" class="img-circle">
                                </span>
                                <span class="line">陈辰- 一周前</span>
                                <span class="line desc small">同样需要进行参数修改.</span>
                            </a>
                            </li>

                            <li>
                                <a href="#">
                                    <span class="image pull-right">
                                        <img src="/picture/thumb-4.png" alt="" class="img-circle">
                                    </span>
                                    <span class="line">张昆- 16天前</span>
                                    <span class="line desc small">这个通知已经下发到各个部门.</span>
                                </a>
                            </li>
                        </ul>
                    </li>

                    <li class="external">
                        <a >所有消息</a>
                    </li>
                </ul>

            </li>

            <!-- Task Notifications -->
            <li class="notifications dropdown">

                <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
                    <i class="entypo-list"></i>
                    <span class="badge badge-warning">1</span>
                </a>

                <ul class="dropdown-menu">
                    <li class="top">
                        <p>您有 6 个待处理的任务</p>
                    </li>

                    <li>
                        <ul class="dropdown-menu-list scroller">
                            <li>
                                <a href="#">
				<span class="task">
					<span class="desc">采购</span>
					<span class="percent">27%</span>
				</span>

                                    <span class="progress">
					<span style="width: 27%;" class="progress-bar progress-bar-success">
						<span class="sr-only">27% 完成</span>
					</span>
				</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
				<span class="task">
					<span class="desc">应用开发</span>
					<span class="percent">83%</span>
				</span>

                                    <span class="progress progress-striped">
					<span style="width: 83%;" class="progress-bar progress-bar-danger">
						<span class="sr-only">83% 完成</span>
					</span>
				</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
				<span class="task">
					<span class="desc">资金审核进程</span>
					<span class="percent">91%</span>
				</span>

                                    <span class="progress">
					<span style="width: 91%;" class="progress-bar progress-bar-success">
						<span class="sr-only">91% 完成</span>
					</span>
				</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
				<span class="task">
					<span class="desc">数据库修复</span>
					<span class="percent">12%</span>
				</span>

                                    <span class="progress progress-striped">
					<span style="width: 12%;" class="progress-bar progress-bar-warning">
						<span class="sr-only">12% 完成</span>
					</span>
				</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
				<span class="task">
					<span class="desc">备份 创建进度</span>
					<span class="percent">54%</span>
				</span>

                                    <span class="progress progress-striped">
					<span style="width: 54%;" class="progress-bar progress-bar-info">
						<span class="sr-only">54% 完成</span>
					</span>
				</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
				<span class="task">
					<span class="desc">升级进度</span>
					<span class="percent">17%</span>
				</span>

                                    <span class="progress progress-striped">
					<span style="width: 17%;" class="progress-bar progress-bar-important">
						<span class="sr-only">17% 完成</span>
					</span>
				</span>
                                </a>
                            </li>
                        </ul>
                    </li>

                    <li class="external">
                        <a href="#">查看所有任务</a>
                    </li>				</ul>

            </li>

        </ul>

    </div>


    <!-- Raw Links -->
    <div class="col-md-6 col-sm-4 clearfix hidden-xs">

        <ul class="list-inline links-list pull-right">

            <li class="dropdown language-selector">

            语言: &nbsp;
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-close-others="true">
                <img src="/image/img/China.jpg">
            </a>

            <ul class="dropdown-menu pull-right">
                <li>
                    <a href="#">
                        <img src="/picture/flag-de.png">
                        <span>Deutsch</span>
                    </a>
                </li>
                <li class="active">
                    <a href="#">
                        <img src="/picture/flag-cn.png">
                        <span>中文</span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="/picture/flag-fr.png">
                        <span>François</span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="/picture/flag-uk.png">
                        <span>English</span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="/picture/flag-es.png">
                        <span>Español</span>
                    </a>
                </li>
            </ul>

        </li>

            <li class="sep"></li>


            <li>
                <a href="#" data-toggle="chat" data-animate="1" data-collapse-sidebar="1">
                    <i class="entypo-chat"></i>
                    聊天

                    <span class="badge badge-success chat-notifications-badge is-hidden">0</span>
                </a>
            </li>

            <li class="sep"></li>

            <li>
                <a th:href="@{/logout}">
                    退出登录&nbsp; <i class="entypo-logout right"></i>
                </a>
            </li>
        </ul>

    </div>

</div>
<!--提取右面聊天侧边栏以供复用-->
<div th:fragment="rightbar">
    <div id="chat" class="fixed" data-current-user="Art Ramadani" data-order-by-status="1" data-max-chat-history="25">

        <div class="chat-inner">

            <h2 class="chat-header">
                <a href="#" class="chat-close" data-animate="1"><i class="entypo-cancel"></i></a>

                <i class="entypo-users"></i>
                聊天室
                <span class="badge badge-success is-hidden">0</span>
            </h2>


            <div class="chat-group" id="group-1">
                <strong>高级管理人员</strong>

                <a href="#" id="sample-user-123" data-conversation-history="#sample_history"><span class="user-status is-online"></span> <em>李名</em></a>
                <a href="#"><span class="user-status is-online"></span> <em>刘小星</em></a>
                <a href="#"><span class="user-status is-busy"></span> <em>马大雷2</em></a>
            </div>


            <div class="chat-group" id="group-2">
                <strong>高级操作员</strong>
                <a href="#"><span class="user-status is-offline"></span> <em>魏南</em></a>
                <a href="#" data-conversation-history="#sample_history_2"><span class="user-status is-offline"></span> <em>晋北</em></a>
            </div>


            <div class="chat-group" id="group-3">
                <strong>设备管理员</strong>

                <a href="#"><span class="user-status is-busy"></span> <em>张三</em></a>
                <a href="#"><span class="user-status is-offline"></span> <em>李四</em></a>
                <a href="#"><span class="user-status is-online"></span> <em>王五</em></a>
            </div>

        </div>

        <!-- conversation template -->
        <div class="chat-conversation">

            <div class="conversation-header">
                <a href="#" class="conversation-close"><i class="entypo-cancel"></i></a>

                <span class="user-status"></span>
                <span class="display-name"></span>
                <small></small>
            </div>

            <ul class="conversation-body">
            </ul>

            <div class="chat-textarea">
                <textarea class="form-control autogrow" placeholder="Type your message"></textarea>
            </div>

        </div>

    </div>
    <!-- Chat Histories -->
    <ul class="chat-history" id="sample_history">


        <li class="opponent unread">
            <span class="user">李名</span>
            <p>今天下午18：00点，请全体高级操作工人到会议室参加会议</p>
            <span class="time">09:25</span>
        </li>
    </ul>
    <!-- Chat Histories -->
    <ul class="chat-history" id="sample_history_2">
        <li class="opponent unread">
            <span class="user">晋北</span>
            <p>污水排放室，谁上午参数重新调整了？</p>
            <span class="time">08:21</span>
        </li>

        <li class="opponent unread">
            <span class="user">晋北</span>
            <p>请打开空气检测器</p>
            <span class="time">08:27</span>
        </li>
    </ul>
</div>

</body>
</html>